<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <!-- 1. Emmet语法 
    1.1快速生成HTML结构语法 
    1.生成标签直接输入标签名按tab键即可比如div然后tab键 ，就可以生成<div> </div>
    2.如果想要生成多个相同标签加上*就可以了比如div*3 就可以快速生成3个div 
    3.如果有父子级关系的标签,可以用>比如ul> li就可以了 
    4.如果有兄弟关系的标签，用+就可以了比如div+p 
    5.如果生成带有类名或者id名字的，直接写.demo 或者#two tab 键就可以了 
    6.如果生成的div类名是有顺序的，可以用 自增符号$  
    7.如果想要在生成的标签内部写内容可以用{}表示 -->



    <!-- 1.2快速生成CSS样式语法
    CSS基本采取简写形式即可.
    1.比如w200 按tab 可以生成width: 200px;
    2.比如Ih26 按tab 可以生成line .height: 26px; -->

    <!-- 1.3快速格式化代码 
    Vscode快速格式化代码: shift+alt+f 
    也可以设置当我们保存页面的时候自动格式化代码: 
    1 )文------[首选项] ---- [设置] ; 
    2 )搜索emmet.include; 
    3 )在settings.json下的[用户]中添加以下语句: 
    "editor.formatOnType": true, 
    "editor.formatOnSave": true 
    只需要设置一次即可,以后都可以自动保存格式化代码 -->

    <h1>复合选择器</h1>
    <p>符合选择器是建立在基础选择器之上的，对基础选择器进行组合形成的</p>
    后代选择器 子选择器 并集选择器 伪类选择器

    <h2>后代选择器</h2>


    <!-- 后代选择器又称为包含选择器,可以选择父元素里面子元素。其写法就是把外层标签写在前面,内层标签写在 后面,中间用空格分隔。当标签发生嵌套时,内层标签就成为外层标签的后代。 
    语法： 元素1 元素2{样式声明}

    上述语法表示选择元素1里面的所有元素2 (后代元素)。
     例如:
     ulli{样式声明}
     选择ul里面所有的li标签元素

    元素1和元素2中间用空格隔开
    元素1是父级，元素2是子级,最终选择的是元素2
    元素2可以是儿子,也可以是孙子等,只要是元素1的后代即可
    -->

    <h2>子选择器</h2>

    <!-- 子元素选择器(子选择器)只能选择作为元素的最近一级子元素。 简单理解就是选亲儿子元素.
    语法:
    元素1>元素2 {样式声明}
    上述语法表示选择元素1里面的所有直接后代(子元素)元素2。
    例如:
    div>p{样式声明}/*选择div里面所有最近一级p标签元素
    ●元愫1和元愫2中间用大于号隔开
    ●元素1是父级,元素2是子级,最终选择的是元素2
    ●元素2必须是亲儿子，其孙子、重孙之类都不归他管.你也可以叫他儿子选择器 -->


    <h2>并集选择器</h2>

    <!-- 1.4并集选择器(重要)
    并集选择器可以选择多组标签,同时为他们定义相同的样式。通常用于集体声明.
    并集选择器是各选择器通过英文逗号(, )连接而成,任何形式的选择器都可以作为并集选择器的一部分。
    语法:
    元素1,元素2 {样式声明}
    上述语法表示选择元素1和元素2
    例如:
    ul,div {样式声明}   选择ul和div标签元素
    ●元素1和元素2中间用逗号隔开
    ●逗号可以理解为和的意思
    ●并集选择器通常用于集体声明 -->

    <note>

    </note>
    <to></to>
    <from></from>
    <heading></heading>
















</head>

<body>



</body>

</html>